<template>
  <div>
    <h1>{{ sum }}---放大10倍后的数:{{ bigSumData }}</h1>
    <button @click="add">点击我+1</button> &nbsp;
    <hr />
    <div>
      <img v-for="(dog, index) in dogList" :src="dog" :key="index" />
      <hr />
      <button @click="addDog">点击我添加一只小狗</button>
    </div>
  </div>
</template>

<script setup lang="ts">
import useSum from "../hooks/useSum";
import useDog from "../hooks/useDog";

const { sum, add, bigSumData } = useSum();
const { dogList, addDog } = useDog();
</script>
<style scoped>
img {
  height: 200px;
  margin-right: 10px;
}
</style>
